from selenium import webdriver
from selenium.webdriver.chrome.options import Options
from selenium.webdriver.chrome.service import Service
from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC

###########################################################################
# 下载应用到本地 包括chrome chromedriver ，解压后加入环境变量                 #
# 地址： https://googlechromelabs.github.io/chrome-for-testing/            #
# 启动命令: start chrome --remote-debugging-port=9222                      #
###########################################################################

# 配置Chrome选项
chrome_options = Options()
chrome_options.add_experimental_option("debuggerAddress", "127.0.0.1:9222")

# 指定ChromeDriver的路径
chrome_driver_path = 'C:\\Program Files\\chromedriver-win64\\chromedriver.exe'  # 请替换为你的ChromeDriver路径
service = Service(chrome_driver_path)

# 使用Remote WebDriver连接到已打开的Chrome实例
driver = webdriver.Chrome(options=chrome_options, service=service)

# 访问目标网页
driver.get('https://yundun.console.aliyun.com/?spm=5176.ecscore_overview.console-base_product-drawer-left.dwaf.787c4df5dZ74Uq&p=wafnext#/waf/cn/dashboard/index')  # 请替换为你想要访问的网址

# 等待页面加载完成
wait = WebDriverWait(driver, 10)

try:
    # 定位父元素
    parent_div = wait.until(EC.visibility_of_element_located((By.CSS_SELECTOR, ".sky-flexbox.sky-align-item-start.sky-justify-start.waf-dashboard-layout")))
    
    # 在父元素中定位包含指定子元素的'next-tabs'元素
    content_area = parent_div.find_element(By.XPATH, ".//div[contains(@class, 'next-tabs')]//div[@class='next-tabs-tab-inner' and text()='客户端 TOP 10']/ancestor::div[contains(@class, 'next-tabs')]")
    
    # 截屏并保存
    content_area.screenshot('content_screenshot.png')

finally:
    # 关闭浏览器
    driver.quit()